前端测试

为什么写测试

  1. 提高代码质量、降低错误。
  2. 测试可以确保得到预期结果。
  3. 对于长期维护的项目，测试会大大加快开发速度，减轻维护难度。
  4. 方便维护。
  5. 提供用法的文档。

测试方法

黑盒测试

黑盒测试 (Black-box Testing), 测试应用程序的功能, 而不是其内部结构或运作. 测试者不需了解代码、内部结构等, 只需知道什么是应用应该做的事, 即当键入特定的输入, 可得到一定的输出. 测试者通过选择有效输入和无效输入来验证是否正确的输出. 此测试方法可适合大部分的软件测试, 例如集成测试 (Integration Testing) 以及系统测试 (System Testing).

白盒测试

白盒测试 (White-box Testing) 测试应用程序的内部结构或运作, 而不是测试应用程序的功能 (即黑盒测试). 在白盒测试时, 以编程语言的角度来设计测试案例. 白盒测试可以应用于单元测试 (Unit Testing)、集成测试 (Integration Testing) 和系统的软件测试流程, 可测试在集成过程中每一单元之间的路径, 或者主系统跟子系统中的测试.

测试的类型

  1. 单元测试（unit testing）
  2. 功能测试（feature testing）
  3. 集成测试（integration testing）
  4. 端对端测试 (End-to-End testing）: 模仿用户，从某个入口开始，逐步执行操作，直到完成某项工作。
  5. 冒烟测试: VS Code 中测试某些 UI 相关的任务，类似 e2e 测试，但是它的链路不会很长，只是测试某个功能的 UI 是否正常。
  6. 接口监控。
    1. 通过装饰器标注接口的返回类型，校验接口返回的合理性。
    2. 单元测试和 ts 结合【描述】【举例】有 ts 的话，输入参数很容易可以知道有没有问题

单元测试

单元测试是对软件基本组成单元（软件设计的最小单位）进行正确性检验的测试工作，如函数、过程(function,procedure)或一个类的方法(method)。

常用工具：

单元测试 (Unit Testing) 是白盒测试的一种, 用于针对程序模块进行正确性检验的测试工作. 单元 (Unit) 是指最小可测试的部件. 在过程化编程中, 一个单元就是单个程序、函数、过程等; 对于面向对象编程, 最小单元就是方法, 包括基类、抽象类、或者子类中的方法.

另外, 每次修改代码之后, 通过单元测试来验证比把整个应用启动/重启验证要更快/更简单.

覆盖率

测试覆盖率 (Test Coverage) 是指代码中各项逻辑被测试覆盖到的比率, 比如 90% 的覆盖率, 是指代码中 90% 的情况都被测试覆盖到了.

覆盖率通常由四个维度贡献:

  • 行覆盖率 (line coverage) 是否每一行都执行了？
  • 函数覆盖率 (function coverage) 是否每个函数都调用了？
  • 分支覆盖率 (branch coverage) 是否每个 if 代码块都执行了？
  • 语句覆盖率 (statement coverage) 是否每个语句都执行了？

常用的测试覆盖率框架 istanbulopen in new window.

当然覆盖率并不完全是由单元测试贡献, 在单元测试之上还有集成测试等.

Mock

Mock 主要用于单元测试中. 当一个测试的对象可能依赖其他 (也许复杂/多个) 的对象. 为了确保其行为不受其他对象的影响, 你可以通过模拟其他对象的行为来隔离你要测试的对象.

当你要测试的单元依赖了一些很难纳入单元测试的情况时 (例如要测试的单元依赖数据库/文件操作/第三方服务 等情况的返回时), 使用 mock 是非常有用的. 简而言之, Mock 是模拟其他依赖的 behaviour.

什么是 Jest?

Jest是一个由 Facebook 基于 Jasmine 创建的 JavaScript 单元测试框架，提供自动模拟创建和jsdom环境。它通常用于测试组件。

Jest 对比 Jasmine 有什么优势?

与 Jasmine 相比，有几个优点：

  • 自动查找在源代码中要执行测试。
  • 在运行测试时自动模拟依赖项。
  • 允许您同步测试异步代码。
  • 使用假的 DOM 实现（通过jsdom）运行测试，以便可以在命令行上运行测试。
  • 在并行流程中运行测试，以便更快完成。
Jest

几个指标

  • %stmts 是语句覆盖率（statement coverage）：是不是每个语句都执行了？
  • %Branch 分支覆盖率（branch coverage）：是不是每个 if 代码块都执行了？
  • %Funcs 函数覆盖率（function coverage）：是不是每个函数都调用了？
  • %Lines 行覆盖率（line coverage）：是不是每一行都执行了？
AVA
Snapshot Testing

https://jestjs.io/docs/zh-Hans/snapshot-testing

测试覆盖率 coverage

npm run test -- --coverage

使用的 travis.yml

sudo: required
dist: trusty
language: node_js
node_js:
  - "11"
install:
  - npm install -g codecov
  - npm install
script:
  - npm run ci
  - codecov
notifications:
  email: false

集成测试：

集成测试是在单元测试的基础上，将所有模块按照概要设计要求组装成为子系统或系统，验证组装后功能以及模块间接口是否正确的测试工作。集成测试也叫组装测试、联合测试、子系统测试或部件测试。

功能测试

功能测试指的是，站在外部用户的角度，测试软件的某项功能。与内部代码实现无关，只测试功能是否正常。很多时候，单元测试都可以通过，但是整体功能会失败。

测试开发模式

  • TDD：测试驱动的开发（Test-Driven Development）
  • BDD：行为驱动的开发（Behavior-Driven Development）

两者侧重点不一样

  • TDD：基于开发者角度，重点测试函数的输入输出
  • BDD：基于使用者角度，重点测试对用户行为的反应

比如，有一个计数器函数counter，TDD 测试的是输入 1，输出的应该是 2；BDD 测试的是用户访问以后，计数器应该增加一次。

Last Updated:
Contributors: yiliang114